import React from 'react';
import { Path, Svg } from 'react-native-svg';

export const LocationIcon = (): JSX.Element => {
  return (
    <Svg width="24" height="24" viewBox="0 0 24 24" fill="none">
      <Path
        d="M3.87317 9.8866C2.4552 10.5428 2.85364 12.453 4.42395 12.4647L10.8458 12.4882C10.963 12.4882 10.9865 12.5233 10.9865 12.6288L11.0099 19.0155C11.0216 20.6326 12.9552 20.9373 13.6583 19.4256L20.2794 5.10535C20.9825 3.60535 19.7989 2.5155 18.2872 3.21863L3.87317 9.8866ZM5.74817 10.8241C5.72473 10.8241 5.71301 10.8007 5.74817 10.7889L18.3927 5.04676C18.4279 5.02332 18.4513 5.03504 18.4161 5.08191L12.6505 17.703C12.6388 17.7381 12.6271 17.7381 12.6271 17.703L12.674 11.5389C12.674 11.0936 12.3575 10.7772 11.9122 10.7772L5.74817 10.8241Z"
        fill="#838383"
      />
    </Svg>
  );
};

export const MapIcon = ({ fill = '#838383' }: { fill: string }): JSX.Element => {
  return (
    <Svg width="100%" height="100%" viewBox="0 0 24 24">
      <Path
        fill={fill}
        d="M5.843 4.568a8.707 8.707 0 0 1 12.314 12.314l-1.187 1.174q-1.312 1.287-3.406 3.312a2.25 2.25 0 0 1-3.128 0l-3.491-3.396q-.659-.646-1.102-1.09a8.707 8.707 0 0 1 0-12.314m11.253 1.06A7.207 7.207 0 1 0 6.903 15.822l1.488 1.468q1.228 1.201 3.088 3a.75.75 0 0 0 1.042 0l3.395-3.3q.705-.691 1.18-1.168a7.207 7.207 0 0 0 0-10.192M12 7.999a3.002 3.002 0 1 1 0 6.004A3.002 3.002 0 0 1 12 8m0 1.5a1.502 1.502 0 1 0 0 3.004a1.502 1.502 0 0 0 0-3.003"></Path>
    </Svg>
  );
};
